import React from 'react';
import { connect } from 'react-redux';
import DevelopmentPlatformService from "./development-platform.service";
import {Tabs, Divider, Form, Radio, Button, Modal, message, Select, Input} from 'antd';
import {messages} from "share/common";
import Chooser from "components/chooser";
const Option = Select.Option;
import CompactInput from 'components/compact-input'

class AvailableUser extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      setting: {},
      loading: false,
      type: 'ALL',
      result: [],
    };
  }

  componentDidMount() {
    let {defaultValue} = this.props;
    if(defaultValue){
      this.setState({
        type: defaultValue.type,
        result: defaultValue.result,
      });
    }
  }

  onTypeChange = (type) => {
    this.setState({
      type,
      result: [],
    });
    this.props.onChange({type, result: []});
  };

  onResultChange = (value) => {
    const {type} = this.state;
    this.setState({
      result: value,
    });
    this.props.onChange({type, result: value});
  };


  render(){
    const {type, result} = this.state;
    return(
        <CompactInput>
        <Select onChange={this.onTypeChange} value={type}>
          <Option value='ALL'>{messages('common.all')/*全部*/}</Option>
          <Option value='USER'>{messages('basic-5.key13')/*人员*/}</Option>
          <Option value='USER_GROUP'>{messages('common-1.key420')/*人员组*/}</Option>
        </Select>
        <div>
          {
            type === 'ALL' &&
            <Input disabled value={messages('request-2.key4')/*通用*/}/>
          }
        {
          type === 'USER' &&
          <Chooser single={false}
                   showNumber
                   type={'user'}
                   valueKey="id"
                   labelKey="fullName"
                   value={result}
                   placeholder={messages('common.total.selected', {arg1: result.length})/*已选 {arg1} 条*/}
                   onChange={this.onResultChange}
          />
        }
        {
          type === 'USER_GROUP' &&
          <Chooser single={false}
                   showNumber
                   type='user_group'
                   valueKey="id"
                   labelKey="name"
                   value={result}
                   placeholder={messages('common.total.selected', {arg1: result.length})/*已选 {arg1} 条*/}
                   onChange={this.onResultChange}
          />
        }
        </div>
        </CompactInput>
    )
  }
}

AvailableUser.contextTypes = {
  router: React.PropTypes.object,
};

AvailableUser.propTypes = {
  onChange: React.PropTypes.func,
  defaultValue: React.PropTypes.object,
};
AvailableUser.defaultProps = {
  onChange: () => {},
  defaultValue: {type: 'ALL', result: []},
};
function mapStateToProps(state) {
  return {
  }
}

const WrappedDingDing = Form.create()(AvailableUser);
export default connect(mapStateToProps)(WrappedDingDing);
